<html lang="zh" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head>
    <th:block th:include="include :: header('定时任务')"/>
    <style>
        .layui-table-cell .layui-form-checkbox[lay-skin=primary]{top:4px;}
    </style>
</head>
<body>
<div class="layui-layout layui-layout-iframe">
    <div class="layui-fluid">
        <div class="layui-card">
            <!--search form-->
            <form class="layui-form layui-card-header layuiadmin-card-header-auto search-form" id="searchForm">
                <div class="layui-form-item">
                    <div class="layui-inline">
                        <label class="layui-form-label">任务名称</label>
                        <div class="layui-input-inline">
                            <input class="layui-input" type="text" name="jobName" placeholder="" autocomplete="off">
                        </div>
                    </div>
                    <div class="layui-inline">
                        <label class="layui-form-label">任务分组</label>
                        <div class="layui-input-inline input-sm">
                            <select name="jobGroup" th:with="type=${@dict.getType('sys_job_group')}">
                                <option value="">所有</option>
                                <option th:each="dict : ${type}" th:text="${dict.dictLabel}" th:value="${dict.dictValue}"></option>
                            </select>
                        </div>
                    </div>
                    <div class="layui-inline">
                        <label class="layui-form-label">任务状态</label>
                        <div class="layui-input-inline input-sm">
                            <select name="status" th:with="type=${@dict.getType('sys_job_status')}">
                                <option value="">所有</option>
                                <option th:each="dict : ${type}" th:text="${dict.dictLabel}" th:value="${dict.dictValue}"></option>
                            </select>
                        </div>
                    </div>
                    <div class="layui-inline">
                        <button  type="button" class="layui-btn layuiadmin-btn-list" data-type="reload" lay-submit lay-filter="form-search" id="form-search"><i class="layui-icon">&#xe615;</i>搜索</button>
                    </div>
                </div>
            </form>
            <!--table actcion-->
            <div class="layui-card-body">
                <script type="text/html" id="table_job_toolbar">
                    <div class="layui-btn-group" shiro:hasPermission="system:job:add">
                        <button class="layui-btn layui-btn-sm" lay-event="toolbar-job-add" shiro:hasPermission="system:job:add"><i class="layui-icon">&#xe654;</i>新增</button>
                        <button class="layui-btn layui-btn-sm" lay-event="toolbar-job-remove" shiro:hasPermission="system:job:remove"><i class="layui-icon">&#xe640;</i>删除</button>
                        <button class="layui-btn layui-btn-sm" lay-event="toolbar-job-log"><i class="layui-icon">&#xe60a;</i>日志</button>
                    </div>
                </script>
                <table id="table_job" lay-filter="table_job"></table>
                <script type="text/html" id="col_operation">
                    <a shiro:hasPermission="system:job:edit" href="javascript:;" lay-event="edit">编辑</a><span class="splitor">|</span>
                    <a shiro:hasPermission="system:job:edit" href="javascript:;" lay-event="del">删除</a><span class="splitor">|</span>
                    <a shiro:hasPermission="system:job:edit" href="javascript:;" lay-event="exec">执行</a><span class="splitor">|</span>
                    <a shiro:hasPermission="system:job:edit" href="javascript:;" lay-event="detail">详细</a><span class="splitor">|</span>
                    <a shiro:hasPermission="system:job:edit" href="javascript:;" lay-event="log">日志</a>
                </script>

            </div>
        </div>
    </div>
</div>
<th:block th:include="include :: footer"/>
<script th:inline="javascript">
    var editFlag = [[${@permission.hasPermi('system:job:edit')}]];
    var removeFlag = [[${@permission.hasPermi('system:job:remove')}]];
    var statusFlag = [[${@permission.hasPermi('monitor:job:changeStatus')}]];
    var prefix = ctx + "monitor/job";
</script>
<script>
    layui.use(['common'], function () {
        var $ = layui.jquery,
            layer = layui.layer,
            form = layui.form,
            common = layui.common,
            table = layui.table;
        //页面事件列表
        var active = {
            reload: function () {
                search(false);
            },
            remove: function (ids) {
                common.ajaxRemove(prefix + "/remove", ids, function (res) {
                    active['reload'].call(this);
                });
            }
        };

        //查询表单
        form.on('submit(form-search)', function (data) {
            search(true);
        });
        //表格
        table.render({
            elem: '#table_job'
            , method: 'post'
            , url: prefix + "/list" //数据接口
            , toolbar: '#table_job_toolbar'
            , done: function () {
                form.on("switch(status_switch)", function (data) {
                    var jobId = data.elem.dataset.jobid;
                    if (data.elem.checked) {
                        common.ajax.post(prefix + "/changeStatus", {"jobId": jobId, "status": 1}, function (json) {
                            console.log(json);
                        });
                    } else {
                        common.ajax.post(prefix + "/changeStatus", {"jobId": jobId, "status": 0}, function (json) {
                            console.log(json);
                        });
                    }
                });
            }
            , defaultToolbar: ['filter', 'exports']
            , autoSort: false 	//关闭前端排序 使用后端排序
            , limit: getPageSize()
            , limits: getPageList()
            , text: getLoadErrorMsg()
            , page: true
            , cols: new Array([
                {type: 'checkbox', width: 40}
                , {field: 'jobName', title: '任务名称'}
                , {field: 'jobGroup', title: '任务分组'}
                , {field: 'invokeTarget', title: '调用目标字符串'}
                , {field: 'cronExpression', title: '执行表达式'}
                , {
                    field: 'status', visible: statusFlag == 'hidden' ? false : true, align: 'center', title: '任务状态', width: 100,
                    templet: function (item) {
                        return "<input type=\"checkbox\" data-jobId='" + item.jobId + "' lay-filter='status_switch' name=\"switch\" " + (parseInt(item.status) == 1 ? "checked" : "") + " lay-skin=\"switch\" />";
                    }
                }
                , {field: 'createTime', title: '创建时间', sort: true, width: 160}
                , {title: '操作', align: 'center', toolbar: '#col_operation', width: 230}
            ])
        });
        //表格工具栏按钮事件
        table.on('toolbar(table_job)', function (obj) {
            switch (obj.event) {
                case 'toolbar-job-log':
                    window.open(ctx + 'monitor/jobLog');
                    break;
                case 'toolbar-job-remove':
                    var checks = table.checkStatus('table_job');
                    var ids = common.joinArray(checks.data, "jobId");
                    active['remove'].call(this, ids);
                    break;
                case 'toolbar-job-add':
                    showSaveDialog('新增定时任务', prefix + '/add', 'btn-add');
                    break;
            }
        });
        //表格事件
        table.on('tool(table_job)', function (obj) {
            switch (obj.event) {
                case 'del':
                    active['remove'].call(this, obj.data.jobId);
                    break;
                case 'exec': //执行
                    layer.confirm("确定要执行一次该任务么？", function (index) {
                        common.ajax.post(prefix + "/run", {"jobId": obj.data.jobId}, function (data) {
                            console.log(data);
                            if (data.code === 0) {
                                layer.alert("执行成功！")
                            } else {
                                layer.alert(data.msg);
                            }
                        });

                    });
                    break;
                case 'edit':
                    showSaveDialog('修改定时任务', prefix + '/edit/' + obj.data.jobId, 'btn-edit');
                    break;
                case 'log':
                    var url=ctx + 'monitor/jobLog?jobId=' + obj.data.jobId;
                    parent.addTab('定时任务日志',url,parent.getTabId(url));
                    break;
                case 'detail':
                    layer.alert('功能开发中...');
                    break;
            }
        });
    });

    //展示保存表单弹出层
    function showSaveDialog(title, url, formSubmitBtnId) {
        layer.open({
            type: 2,
            title: title,
            shade: false,
            fixed: false,
            area: ['800px', '600px'],
            content: url,
            btn: ["保存", "取消"],
            yes: function (index, layero) {
                var submitID = formSubmitBtnId;//表单提交按钮id
                var submit = layero.find('iframe').contents().find('#' + submitID);//button obj
                layero.find('iframe')[0].contentWindow.successCallback = function () {
                    parent.layer.closeAll();
                    parent.layer.alert('保存成功');
                    parent.search(); //刷新表格数据
                };
                submit.trigger('click');
            }
            , cancel: function (index, layero) {
                layui.layer.close(index);
                return false;
            }
        });
    }
    //表格查询
    function search(isResetCurr) {
        var field = serializeJson($('#searchForm'));
        var sortParam = getSort('table_job');
        if (sortParam) {
            field.orderByColumn = sortParam.sortField;
            field.isAsc = sortParam.sortMethod;
        }
        //执行重载
        var options = {where: field};
        if (isResetCurr == true) {
            options.page = {curr: 1};
        }
        layui.table.reload('table_job', options);
    }
</script>
</body>
</html>